*{
    padding:0;
    margin:0
}
html,body,.index{
    height:100%;
    width:100%;
    background-color:white;
}
.fl{
    float: left;
}
.fr{
    float: right;
}
.clearfix{
    content: '';
    display: block;
    clear: both;
}
.header-nav{
    position: fixed!important;
    width: 100%;
    height: 60px;
    background-color: rgb(102,102,102);
    position: sticky;
    top:0;
    z-index: 999;
    padding: 0 30px 0 60px;
}
.nav-title{
line-height: 60px;
color:#fff;
font-size: 21px;

}
.img-box{
    width:40px;
    height: 40px;
    background-color: #ddd;
    border-radius: 50%;
    margin-top: 10px;
}
.nav-text{
    line-height: 60px;
    color:white;
    margin-left: 20px;
}
.cursor{
    cursor: pointer;
}
.aside{
    position:fixed;
    top:60px;
    left: 0;
    width: 250px;
    height: 100%;
    background-color: rgb(28,28,28);
    // overflow: hidden;
    z-index: 1; 
}
.demo{
    position: absolute;
    top: 0;
    left: 0;
    width: 250px;
    .container{
        width: 100%;
        padding-right: 0px;
        padding-left: 0px;
        margin-right: 0;
        margin-left: 0;
        .row{
            width:100%;
            
            margin-right: 0;
            margin-left:0;
            .col-md-offset-3{
                width: 250px;
                position: relative;
                margin-left: 0;
                .panel-group{
                    width: 250px;
                    position: absolute;
                    left: 0;
                    .panel{

                        border-radius: 0px;
                        margin-top: 0px;
                        border:none;
                        background-color: rgb(28,28,28);
                        border-bottom: 0.5px groove  rgb(71, 69, 69);
                        border-left: 0px groover rgb(71, 69, 69);
                        // height: 50px;
                        // box-shadow: 1px 1px 1px rgb(30, 81, 90);
                        .panel-heading{
                            background-color: rgb(28,28,28);
                            text-align: center;
                            border-top-left-radius: 0px;
                            border-top-right-radius: 0px;
                            color: rgb(194, 194, 194);
                            box-sizing: border-box;
                             box-shadow: 1px 1px 3px rgb(71, 69, 69);
                             padding: 16.5px 0;
                             transition: border 0.2s linear
                            //  height: 50px;
                        }
                        .panel-body{
                            // border-top: 0px solid #ddd!important;
                            color: rgb(194, 194, 194)!important;
                            // padding-left: 30px;
                            border-bottom: 0.5px groove  rgb(71, 69, 69);
                            // text-align: center;
                            // height: 80px;
                            padding: 0!important;
                            p{
                        // widt;
                            }
                        }
                        a{
                        }
                    }
                }
            }
        }
    }
}
.panel-group .panel-heading+.panel-collapse>.list-group, .panel-group .panel-heading+.panel-collapse>.panel-body {
    border-top: 0px solid #ddd;
    color: rgb(194, 194, 194)!important;
    padding-left: 25px;
}
.bor{
    border-left: 15px solid rgb(17, 180, 131)!important;
}
// .panel:nth-child(1) .panel-body p,
.panel .panel-body p{
    margin: 0 ;
    width: 100%!important;
    height: 60px;
    // text-align: center;
    padding-left: 55px;
    line-height: 60px;
    &:hover{
        background-color: rgb(71,76,92);
    }
}
.content-box{
    width: 100%;
    // display: flex;
    position: relative;
    overflow: hidden;
    height: 100%;
}
.contents{
    width: 100%;
    height: 872px;
    position: absolute;
    left: 250px;
    top: 60px;
    color:black;
    .contents-search{
        display: flex;
        width: 600px;
        margin: 30px  0 0 50px;
        div{
            line-height: 34px;
            height: 34px;
        }
        input{
            margin-left: 30px;
            width: 420px;
        }
        span{
            background-color: rgb(91,192,222);
            cursor: pointer;
        }
        
    }
    .btn-warning1{
        display: block;
        margin: 40px 0 0 50px;
    }
}
.mytable{
    margin:50px 0 0 50px;
    width: 1300px;
    .table{
        // border: 1px groove rgb(241, 233, 233);
        thead{
            background-color: rgb(52,58,64);
            color:white;
            
        }
        tbody{
            tr:hover{
            background-color: #918484;
            }
        }
    }
}
.fenye{
    // position: absolute;
    // top:750px;
    margin: 30px 0 0 (50px+76.38px);
//     ul>  .active{
// background-color: rgb(51,122,183);
position: relative;
//     }
}
.img-box{
    overflow: hidden;
    position: relative;
}
.auto-img{
    display: block;
    position: absolute;
    margin:  auto;
    width: 100%;
}
.hides{
    display: none;
}
 .actives{
    background-color: rgb(89, 38, 209);
}
#prevpage{
    display: inline-block;
    width: 76.38px;
    height: 37px;
    line-height: 37px;
    text-align: center;
    position: absolute;
    left: -76.38px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border: 1px solid #ddd;
    cursor: pointer;
    color: #337ab7;
}
#nextpage{
    display: inline-block;
    width: 76.38px;
    height: 37px;
    line-height: 37px;
    text-align: center;
    color: #337ab7;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border: 1px solid #ddd;
    cursor: pointer;
}
#totalpage1{
    display: inline-block;
    width: 76.38px;
    height: 37px;
    line-height: 37px;
    text-align: center;
    color: #337ab7;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border: 1px solid #ddd;
    cursor: pointer;
}
// .pagination .page-item{
//     background-color: rgb(48, 44, 44);
// }